{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>{{ title }}</title>
	<link rel="shortcut icon" type="image/ico" href="{% static 'img/logo.jpg' %}"/>
	<link rel="stylesheet" type="text/css" href="{% static 'css/index.css' %}">
	<script type="text/javascript" src="{% static 'js/jq3.2.js' %}"></script>
</head>
<body>
	<!-- 头部 -->
	<div class="title">
		<div class="ftop">
			<img src="{% static 'img/1.jpg' %}" alt="">
		</div>
		<div class="wdaohang">
			<ul id="wdaohang">
				<li class="act"><a href="javascript:void(0)">网站首页</a></li>
				<li><a href="javascript:void(0)">走进大音</a></li>
				<li><a href="javascript:void(0)">大音咨询</a></li>
				<li><a href="javascript:void(0)">瑜伽课程</a></li>
				<li><a href="javascript:void(0)">舞蹈课程</a></li>
				<li><a href="javascript:void(0)">视频展示</a></li>
				<li><a href="javascript:void(0)">团队风采</a></li>
				<li><a href="javascript:void(0)">在线留言</a></li>
				<li><a href="javascript:void(0)">联系我们</a></li>
			</ul>
		</div>
	</div>
	<!-- 轮播图 -->
	<div class="banner">
		<img src="{% static 'img/4.jpg' %}" alt="">
	</div>
	<!-- 内容区 -->
	<div class="conner">
		<div class="home">
			<img src="{% static 'img/5.jpg' %}" alt="">
			<img src="{% static 'img/6.jpg' %}" alt="">
		</div>
		<div class="sub">
			<div class="subcon">
				<img src="{% static 'img/7.jpg' %}" alt="">
				<ul>
					<li><img src="{% static 'img/8.jpg' %}" alt=""></li>
					<li><img src="{% static 'img/9.jpg' %}" alt=""></li>
					<li><img src="{% static 'img/10.jpg' %}" alt=""></li>
				</ul>
			</div>
		</div>
		<div class="dayin">
			<img src="{% static 'img/11.jpg' %}" alt="">
			<ul>
				<li><img src="{% static 'img/12.jpg' %}" alt=""></li>
				<li><img src="{% static 'img/13.jpg' %}" alt=""></li>
			</ul>
		</div>
		<div class="shop">
			<img src="{% static 'img/14.jpg' %}" alt="">
			<ul>
				<li>
					<img src="{% static 'img/15.jpg' %}" alt="">
					<div>
						<span>瑜伽垫</span><br>
						<span><b>RMB 99.00</b></span>
					</div>
				</li>
				<li>
					<img src="{% static 'img/16.jpg' %}" alt="">
					<div>
						<span>户外运动腰包</span><br>
						<span><b>RMB 39.00</b></span>
					</div>
				</li>
				<li>
					<img src="{% static 'img/17.jpg' %}" alt="">
					<div>
						<span>专属定制瑜伽铺巾</span><br>
						<span><b>RMB 89.00</b></span>
					</div>
				</li>
				<li>
					<img src="{% static 'img/18.jpg' %}" alt="">
					<div>
						<span>磨砂防爆瑜伽球</span><br>
						<span><b>RMB 99.00</b></span>
					</div>
				</li>
			</ul>
			<div class="detail">
				<span><a href="javascript:void(0)">点击查看更多商品 ——></a></span>
			</div>
		</div>
		<div class="team">
			<img src="{% static 'img/19.jpg' %}" alt="">
			<div class="teamtype">
				<span class="action">名师风采</span>
				<span>学员风采</span>
			</div>
			<ul>
				<li><img src="{% static 'img/20.jpg' %}" alt=""><span>学员风采</span></li>
				<li><img src="{% static 'img/21.jpg' %}" alt=""><span>学员风采</span></li>
				<li><img src="{% static 'img/22.jpg' %}" alt=""><span>学员风采</span></li>
				<li><img src="{% static 'img/23.jpg' %}" alt=""><span>学员风采</span></li>
			</ul>
		</div>
		<div class="food">
			<img src="{% static 'img/24.jpg' %}" alt="">
			<ul>
				<li>
					<img src="{% static 'img/25.jpg' %}" alt="">
					<div>
						<span>&nbsp;&nbsp;&nbsp;&nbsp;牛奶纯蛋&nbsp;&nbsp;&nbsp;&nbsp;273Kcal</span>
					</div>
				</li>
				<li>
					<img src="{% static 'img/26.jpg' %}" alt="">
					<div>
						<span>&nbsp;&nbsp;&nbsp;&nbsp;香烤三文鱼&nbsp;&nbsp;&nbsp;&nbsp;209Kcal</span>
					</div>
				</li>
				<li>
					<img src="{% static 'img/27.jpg' %}" alt="">
					<div>
						<span>&nbsp;&nbsp;&nbsp;&nbsp;燕麦酸奶三明治&nbsp;&nbsp;&nbsp;&nbsp;568Kcal</span>
					</div>
				</li>
			</ul>
			<div class="detail">
				<span><a href="javascript:void(0)">点击查看更多搭配 ——></a></span>
			</div>
		</div>
	</div>
	<!-- 留言和新闻 -->
	<div class="connect">
		<div class="conleft">
			<img src="{% static 'img/33.jpg' %}" alt="">
			<h3>自定义标题</h3>
			<p><a href="javascript:void(0)">文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容...【详情】</a></p>
			<hr>
			<ul>
				<li><a href="javascript:void(0)">新闻标题新闻标题新闻标题<span>2017/10/09</span></a></li>
				<li><a href="javascript:void(0)">新闻标题新闻标题新闻标题<span>2017/10/09</span></a></li>
				<li><a href="javascript:void(0)">新闻标题新闻标题新闻标题<span>2017/10/09</span></a></li>
				<li><a href="javascript:void(0)">新闻标题新闻标题新闻标题<span>2017/10/09</span></a></li>
				<li><a href="javascript:void(0)">新闻标题新闻标题新闻标题<span>2017/10/09</span></a></li>
			</ul>
		</div>
		<div class="conright">
			<img src="{% static 'img/34.jpg' %}" alt="">
			<input type="text" id="myname" placeholder="请输入您的姓名：">
			<input type="text" id="phone" placeholder="请输入您的电话：">
			<textarea id="notes" placeholder="请输入留言内容："></textarea>
			<button style="cursor:pointer">提&nbsp;&nbsp;&nbsp;交</button>
		</div>
	</div>
	<!-- 底部导航 -->
	<div class="bdaohang">
		<ul>
			<li>网站首页</li>
			<li>走进大音</li>
			<li>大音咨询</li>
			<li>瑜伽课程</li>
			<li>舞蹈课程</li>
			<li>视频展示</li>
			<li>团队风采</li>
			<li>在线留言</li>
			<li>联系我们</li>
		</ul>
	</div>
	<!-- 版权信息 -->
	<div class="copys">
		<img src="{% static 'img/30.jpg' %}" alt="">
	</div>
	<div class="footer"></div>
	<script>
	var nowval='';
	$(".conleft a").click(function(){
		if($(this).val().length>0){
			nowval=$(this).val();
		}else{
			nowval=$(this).text();
		}
		alert(nowval);
	});
	$("button").click(function(){
		var myname=$("#myname").val();
		var phone=$("#phone").val();
		var notes=$("#notes").val();
		var ret=/^1{1}(3|5|8){1}[0-9]{9}$/;
		if (myname.length<=0) {
			alert("请填写姓名！");
		}else if(ret.test(phone)==false){
			alert("手机格式错误！");
			$("#phone").val("");
		}else if(notes.length<=0){
			alert("请输入留言信息！");
		}else{
			alert("姓名："+myname+"\n"+"电话："+phone+"\n"+"留言："+notes);
		}
	});
	$("#wdaohang li").click(function(){
		$("#wdaohang li").removeClass("act");
		$(this).addClass("act");
	});
	$(".teamtype span").click(function(){
		$(".teamtype span").removeClass("action");
		$(this).addClass("action");
	});
	</script>
</body>
</html>